<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7"/>
    <title>悦定后台管理系统</title>

    <!--判断是否登陆-->
    <script type="text/javascript" src="../../vendor/jquery-2.0.3.min.js"></script>
    <script type="text/javascript" src="../../js/config.js"></script>
    <script type="text/javascript" src="../../js/jquerySession.js"></script>
    <script type="text/javascript">
        if ($.session.get('token') == null) {
            alert("用户未登录！");
            window.location.href = "../../login.html"
        }
    </script>

    <link href="../../css/reset.css" rel="stylesheet" type="text/css"/>
    <link href="../../css/system.css" rel="stylesheet" type="text/css"/>
    <link href="../../css/table_form.css" rel="stylesheet" type="text/css"/>
    <link href="../../css/default.css" rel="stylesheet" type="text/css">
    <link rel="alternate stylesheet" type="text/css" href="../../css/styles2.css" title="styles2" media="screen">
    <link rel="alternate stylesheet" type="text/css" href="../../css/styles3.css" title="styles3" media="screen">
    <link rel="alternate stylesheet" type="text/css" href="../../css/styles4.css" title="styles4" media="screen">
    <script language="javascript" type="text/javascript" src="../../vendor/jquery.min.js"></script>
    <script language="javascript" type="text/javascript" src="../../js/admin_common.js"></script>
    <script language="javascript" type="text/javascript" src="../../js/styleswitch.js"></script>
    <script language="javascript" type="text/javascript" src="../../js/formvalidator.js" charset="UTF-8"></script>
    <script language="javascript" type="text/javascript" src="../../js/formvalidatorregex.js" charset="UTF-8"></script>
    <script type="text/javascript" charset="utf-8" src="../../vendor/kindeditor-all.js"></script>
    <script type="text/javascript" charset="utf-8" src="../../vendor/zh-CN.js"></script>
    <script type="text/javascript">
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('textarea[name="content"]', {
                uploadJson: baseUrl + '/uploadImage',//上传
                allowFileManager: false,
                allowImageUpload : true,
                fullScreenMode:false,
                afterBlur: function () {
                    this.sync();
                }  //数据同步
            });
        });
    </script>
    <script type="text/javascript">
        window.focus();
    </script>
    <script type="text/javascript">
        $(function () {
            $.getJSON(baseUrl + "/matches", function (json) {
                var data = json.data;
                var matches = $(".matches");
                matches.empty();
                $.each(data, function (i, match) {
                    var option = "";
                    if (i == 0) {
                        option += "<option value=" + match.id + " selected='selected'>";
                        option += match.name;
                        option += "</option>";
                        matches.append(option);

                        $.getJSON(baseUrl + "/matches/" + match.id + "/routes", {
                            match_id: match.id
                        }, function (json) {
                            var data = json.data;
                            var routes = $(".routes");
                            routes.empty();
                            $.each(data, function (i, route) {
                                var option = "";
                                if (i == 0) {
                                    option += "<option value='" + route.id + "'>";
                                    option += route.introduction;
                                    option += "</option>";
                                    routes.append(option);

                                    $.getJSON(baseUrl + "/matches/" + match.id + "/routes/" + route.id + "/points", {
                                        match_id: match.id,
                                        route_id: route.id
                                    }, function (json) {
                                        var routes = $(".points");
                                        routes.empty();
                                        $.each(json.data, function (i, point) {
                                            var option = "";
                                            if (i == 0) {
                                                option += "<option value='" + point.id + "' selected='selected'>";
                                                option += point.name;
                                                option += "</option>";
                                                routes.append(option);
                                            } else {
                                                option += "<option value='" + point.id + "'>";
                                                option += point.name;
                                                option += "</option>";
                                                routes.append(option);
                                            }
                                        })
                                    });
                                } else {
                                    option += "<option value='" + route.id + "'>";
                                    option += route.introduction;
                                    option += "</option>";
                                    routes.append(option);
                                }
                            })
                        })

                    } else {
                        option += "<option value=" + match.id + ">";
                        option += match.name;
                        option += "</option>";
                        matches.append(option);
                    }
                })
            });

            $(".matches").change(function () {
                var matchId = $(".matches option:selected").val();
                $.getJSON(baseUrl + "/matches/" + matchId + "/routes", {
                    match_id: matchId
                }, function (json) {
                    var data = json.data;
                    var routes = $(".routes");
                    routes.empty();
                    $.each(data, function (i, route) {
                        var option = "";
                        if(i == 0){
                            option += "<option value='" + route.id + "' selected = 'selected'>";
                            option += route.introduction;
                            option += "</option>";
                            routes.append(option);

                            $.getJSON(baseUrl + "/matches/" + matchId + "/routes/" + route.id + "/points", {
                                match_id: matchId,
                                route_id: route.id
                            }, function (json) {
                                var routes = $(".points");
                                routes.empty();
                                $.each(json.data, function (i, point) {
                                    var option = "";
                                    option += "<option value='" + point.id + "'>";
                                    option += point.name;
                                    option += "</option>";
                                    routes.append(option);
                                })
                            });

                        }else {
                            option += "<option value='" + item.id + "'>";
                            option += item.introduction;
                            option += "</option>";
                            routes.append(option);
                        }
                    })
                })
            });

            $(".routes").change(function () {
                var matchId = $(".matches option:selected").val();
                var routeId = $(".routes option:selected").val();
                $.getJSON(baseUrl + "/matches/" + matchId + "/routes/" + routeId + "/points", {
                    match_id: matchId,
                    route_id: routeId
                }, function (json) {
                    var routes = $(".points");
                    routes.empty();
                    $.each(json.data, function (i, item) {
                        var option = "";
                        option += "<option value='" + item.id + "'>";
                        option += item.name;
                        option += "</option>";
                        routes.append(option);
                    })
                });
            });

        })
    </script>
    <style type="text/css">
        html {
            _overflow-y: scroll
        }
    </style>
</head>
<body>
<div class="subnav">
</div>


<form name="myform" id="myform" action="#" method="post">
    <div class="pad-10">
        <div class="col-tab">
            <ul class="tabBut cu-li">
                <li id="tab_setting_1" class="on">添加任务</li>
            </ul>
            <div id="div_setting_1" class="contentList pad-10">

                <table width="100%" class="table_form " style="text-align: left">
                    <tr>
                        <th>比赛名称：</th>
                        <td>
                            <select name="isRecomm" class="matches">

                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>路线名称：</th>
                        <td>
                            <select name="isRecomm" class="routes">

                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>点标名称：</th>
                        <td>
                            <select name="isRecomm" class="points">

                            </select>
                        </td>
                    </tr>
                    <tr>
                        <th>任务名称：</th>
                        <td>
                            <input type="text" name="mission" class="mission"/>
                        </td>
                    </tr>
                    <tr>
                        <th>任务描述：</th>
                        <td>
						<textarea id="editor_id" name="content" rows="" cols=""
                                  style="width: 250px;height: 80px;resize: none;text-align: left;">

						</textarea>
                        </td>
                    </tr>

                </table>
            </div>
        </div>
    </div>
</form>
</body>

</html>